'use strict';
const path = require('path');
const defaultSettings = require('./src/settings.js');
// const BASE_URL = '/dev-api'

function resolve (dir) {
  return path.join(__dirname, dir);
}

const name = defaultSettings.title || '振涛教育SIMS系统'; // page title

const port = process.env.port || process.env.npm_config_port || 8080; // dev port

// 配置官网地址: https://cli.vuejs.org/zh/
module.exports = {
  publicPath: '/',
  outputDir: 'dist',
  assetsDir: 'static',
  lintOnSave: process.env.NODE_ENV === 'development',
  productionSourceMap: false,
  devServer: {
    port,
    open: true
    // proxy: {
    //   '/api': {
    //     // target 后端接口地址
    //     target: 'http://127.0.0.1:4001',
    //     // pathRewrite 将 /api 替换为 /
    //     pathRewrite: { '^/api': '' }, // 打包之后去掉/api
    //     // changeOrigin 设置为true, 可以让服务器认为是跨域
    //     changeOrigin: true
    //   }
    // }
  },
  configureWebpack: {
    name,
    resolve: {
      // 解决webpack5之后 重大改革node的pollfill中不包含path的问题
      fallback: { path: require.resolve('path-browserify') },
      // 设置别名
      alias: {
        '@': resolve('src')
      }
    }
  },
  // chainWebpack 修改webpack配置
  chainWebpack (config) {
    // 不让webpack进行预加载
    config.plugins.delete('preload'); // TODO: need test
    // 不让webpack进行预查询
    config.plugins.delete('prefetch'); // TODO: need test
    // 处理svg图标
    config.module
      .rule('svg')
      .exclude.add(resolve('src/icons'))
      .end();
    // 添加svg-sprite-loader
    config.module
      .rule('icons')
      .test(/\.svg$/)
      .include.add(resolve('src/icons'))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({
        symbolId: 'icon-[name]'
      })
      .end();
    config.module
      .rule('vue')
      .use('vue-loader')
      .loader('vue-loader')
      // .tap : 修改 vue-loader 配置
      // .tap(options => {
      //   return options
      // })
      .end();

    config
    // 在html中添加js/css文件
      .when(process.env.NODE_ENV !== 'development',
        config => {
          config
            .plugin('ScriptExtHtmlWebpackPlugin')
            .after('html')
            .use('script-ext-html-webpack-plugin', [{
              // `runtime` must same as runtimeChunk name. default is `runtime`
              inline: /runtime\..*\.js$/
            }])
            .end();
          config
            .optimization.splitChunks({
              // chunks 表示要分割的文件
              chunks: 'all',
              // cacheGroups 表示分割的缓存组
              cacheGroups: {
                // 打包公共模块
                libs: {
                  // name 表示缓存组的名称
                  name: 'chunk-libs',
                  // test 命中的文件
                  test: /[\\/]node_modules[\\/]/,
                  // priority 表示优先级
                  priority: 10,
                  // chunks : 'initial' 表示只打包初始时依赖的第三方包
                  chunks: 'initial' // 只打包初始时依赖的第三方包
                },
                elementUI: {
                  // name 表示缓存组的名称
                  name: 'chunk-elementUI', // 单独将 elementUI 拆包
                  // priority 越大越优先
                  priority: 20,
                  // 命中的文件
                  test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // 优先拆分 elementUI
                },
                commons: {
                  name: 'chunk-commons',
                  test: resolve('src/components'), // 可以自定义拆分规则
                  minChunks: 3, // 表示被引用次数
                  priority: 5, // 表示优先级
                  reuseExistingChunk: true // 表示是否可以复用已经存在的代码块
                }
              }
            });
          config.optimization.runtimeChunk('single');
        }
      );
  }
};
